/**
 * 微信编辑器
 <!--[if lte IE 8]>
 <script>
 document.createElement('wechat-editor');
 </script>
 <![endif]-->
 */
angular.module('tt').directive('wechatEditor', function ($compile) {
    return {
        restrict: 'AE',
        transclude: true,
        scope: {
            id: '@?',
            style: '@?',
        },
        compile: function ($element, $attrs, $transclude) {

            if (angular.isUndefined($attrs['id'])) {
                $attrs['id'] = 'wechat_editor';
            }
            if (angular.isUndefined($attrs['style'])) {
                $attrs['style'] = '';
            }
            var s = [];
            s.push('<div style="width: 99%;">');
            s.push('<div style="margin-bottom: 10px;"><a ng-click="insertVar(\'tpl\')" class="layui-btn layui-btn-xs">模板变量</a> ' +
                '<a ng-click="insertVar(\'system\')" class="layui-btn layui-btn-xs layui-btn-normal">系统内置变量</a></div>')
            s.push('<script id="_' + $attrs['id'] + '" style="' + $attrs['style'] + '" type="text/plain" name="content"></script>');
            s.push('</div>');
            s.push('<div style="color: gray;">提示:变量会自动添加<span style="color: #1E9FFF">颜色</span>，显示内容的时候会自动移除颜色；' +
                '变量所在位置显示的值，会在正式展示内容的时候自动更新</div>');

            $element.append(s.join(''));

            return function ($scope, $element, $attr) {

                // console.log('$transclude', $element);
            };
        },

        controller: function ($scope, $element, $attrs, $transclude) {

            $element.find('script').append($transclude());
            $compile($element.contents())($scope);
            var ue = UE.getEditor('_' + $attrs['id'], {
                allowDivTransToP: false
            });

            $scope.insertVar = function (type) {
                if ('system' == type) {
                    xlayer.open('系统内置变量', '?r=wechat/var/system&btn=1', function (info) {
                        // 使用双重 span 的目的是，除非修改源代码，否则编辑器中的样式，不会影响到模板变量
                        ue.execCommand('insertHtml', '<span class="wechat_var_system"><span class="wechat_var_system_' + info['name'] + '">' + info['title'] + '</span></span>')
                    })
                } else if ('tpl' == type) {
                    xlayer.open('模板变量', '?r=wechat/var/index&btn=1', function (info) {
                        ue.execCommand('insertHtml', '<span class="wechat_var_tpl"><span class="wechat_var_tpl_' + info['name'] + '">' + info['title'] + '</span></span>')
                    })
                }
            };
        }
    };
});